<template>
  <svg :width="width" :height="height">
      <circle :cx="width/2" :cy="height/2" :r="width/2-3" fill="none"  stroke-width="2"
              stroke-dasharray="10 2" ref="circle" id="circle"
      >
      </circle>
  </svg>
</template>

<script>
export default {
    name: "ScoreCircle",
    props: {
        width: {
            type: Number,
            default: 100,
        },
        height:{
            type: Number,
            default: 100
        },
        stroke: {
            type: String,
            default: ""
        }
    },
    data() {
        return {
        }
    },
    created() {

    },
    mounted() {
        this.$refs.circle.setAttribute("stroke", this.stroke)
        // a.setAttribute("stroke", 'blue')
    }
}
</script>

<style scoped>

</style>